<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>九九乘法表</title>
    <style>
        table {
            border-collapse: collapse;
        }

        td {
            border: 1px solid #ccc;
            padding: 3px 10px;
        }
    </style>
</head>

<body>


    <script>
        
        /*
        找规律，假设最上面的一层作为第1层，表格的分布规律：
        1 九九乘法表的表格是由9行，每行最多9列的单元格组成。
        2 乘法表的层数 = 表格的行数 = 每行中的列数。如乘法表的第3层，
        是表格的第3行，且共有3个单元格。
        
        找规律，假设最上面的一层作为第1层，乘法运算的规律：
        1 被乘数的取值范围在“1~每行中的列数”之间。
        如表格第3行中被乘数的值在1~3之间。
        2 乘数的值 = 表格的行数。如表格第3行中乘数的值就为3。
        */


        document.write("<table>");
        for (var i = 1; i <= 9; i++) {
            document.write("<tr>");
            for (var j = 1; j <= i; j++) {
                document.write("<td>");
                document.write(j + "*" + i + "=" + j * i);
                document.write("</td>");
            }
            document.write("</tr>");
        }
        document.write("</table>");


    </script>
</body>

</html>